﻿<!DOCTYPE html>
<html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="">
        <meta name="author" content="">
        <link rel="shortcut icon" href="./image/favicon.png">
        <title>
            多媒体
        </title>
        <!-- Bootstrap core CSS -->
        <link href="./css/bootstrap.min.css" rel="stylesheet">
        <!-- Custom styles for this template -->
        <link href="./css/smore-all.css" rel="stylesheet">
        <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media
        queries -->
        <!--[if lt IE 9]>
            <script src="https://oss.maxcdn.com/libs/html5shiv/3.6.2/html5shiv.js">
            </script>
            <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js">
            </script>
        <![endif]-->
        <style>
        </style>
    </head>
    
    <body style="">
        <div class="container-1000 editing-surface" style="" id="editing-surface">
            <div class="location-box-wrapper">
                <div class="flyer-location fn-segoe">
                    <a class="change-location">
                        change
                    </a>
                    <span class="pin">
                        &nbsp;
                    </span>
                    <span class="content">
                        <span class="has-no-city">
                            This flyer has no location.
                        </span>
                        <span class="has-city">
                            This flyer is located in
                            <span class="selected" title="Beijing">
                                Beijing
                            </span>
                            .
                        </span>
                    </span>
                </div>
                <div class="clear">
                </div>
                <div id="change-location-popover" style="display: none;">
                    <div class="form-content popover-form fn-segoe change-location-popover">
                        <div class="panel gray-panel top bottom-dash">
                            <h2>
                                Where is your flyer located?
                            </h2>
                            <p>
                                Geotag your flyer to promote it in your city!
                            </p>
                        </div>
                        <div class="wrapper">
                            <div class="location-label">
                                City
                            </div>
                            <div class="location-content">
                                <input type="text" class="location-input" placeholder="Enter a city">
                                <div class="checkbox-info">
                                    <input type="checkbox" id="location-checkbox" class="location-checkbox">
                                    <label for="location-checkbox">
                                        No Location
                                    </label>
                                </div>
                            </div>
                        </div>
                        <div class="buttons-bar">
                            <a class="cancel" original-title="">
                                Cancel
                            </a>
                            <button class="gray-button done" tabindex="1002">
                                Done
                            </button>
                        </div>
                    </div>
                </div>
            </div>
            <div id="right-boxes">
                <!-- Publish box -->
                <div class="right-toolbox fn-segoe " id="done-edit-box">
                    <a id="publish-button" class="big-button transparent-button">
                        Done Editing
                    </a>
                    <p class="post-alternative-action">
                        Preview and share your flyer.
                    </p>
                    <div class="clear">
                    </div>
                    <div class="clear">
                    </div>
                    <div class="flourish">
                    </div>
                </div>
                <div id="sticky-box">
                    <div id="save-box" class="right-toolbox fn-segoe">
                        <a class="save-button medium-button wide-button transparent-button">
                            Save Now
                        </a>
                        <div class="post-alternative-action last-saved fx-rocker" style="height: 18px;">
                            <div class="fx-wrapper" style="margin-top: 0px;">
                                <div class="fx-line">
                                    Saved
                                    <span class="pretty-date" rel="1382666304" data-format="%s.">
                                        just now.
                                    </span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="right-toolbox fn-segoe feels-picker">
                        <div class="top">
                            <h4>
                                Design
                            </h4>
                            <div class="feel-button feel-modern" id="feel-button">
                                <div class="arrow">
                                </div>
                                <a class="medium-button wide-button transparent-button design-picker"
                                id="feel-picker" data-popover="feels">
                                </a>
                            </div>
                        </div>
                        <div class="bottom">
                            <div class="design-picker backgrounds" id="backgrounds-picker" data-popover="backgrounds">
                                <span class="icon">
                                </span>
                            </div>
                            <div class="design-picker swatches" id="swatches-picker" data-popover="swatches">
                                <span class="icon">
                                </span>
                            </div>
                            <div class="design-picker fonts" id="fonts-picker" data-popover="fonts">
                                <span class="icon">
                                </span>
                            </div>
                            <div class="clear">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div id="editor-box">
                <div class="display-page">
                    <div class="theme-bg-color3 page-top  ">
                    </div>
                    <div class="editor-wrapper">
                        <div class="editor new-editor ui-sortable" id="edit-area">
                            <div class="insert-content" id="insert-content">
                                <div class="add-content-menu fn-segoe">
                                    <div class="insert-button item-text" data-type="text.paragraph">
                                        <div class="icon">
                                        </div>
                                        <label>
                                            Text
                                        </label>
                                    </div>
                                    <div class="insert-button item-title" data-type="text.small_title">
                                        <div class="icon">
                                        </div>
                                        <label>
                                            Title
                                        </label>
                                    </div>
                                    <div class="insert-button item-picture" data-type="images.placeholder">
                                        <div class="icon">
                                        </div>
                                        <label>
                                            Picture
                                        </label>
                                    </div>
                                    <div class="insert-button item-gallery" data-type="gallery">
                                        <div class="icon">
                                        </div>
                                        <label>
                                            Gallery
                                        </label>
                                    </div>
                                    <div class="insert-button item-event" data-type="event">
                                        <div class="icon">
                                        </div>
                                        <label>
                                            Event
                                        </label>
                                    </div>
                                    <div class="insert-button item-bio" data-type="text.bio">
                                        <div class="icon">
                                        </div>
                                        <label>
                                            Bio
                                        </label>
                                    </div>
                                    <div class="insert-button item-audio" data-mode="creator" data-type="audio">
                                        <div class="icon">
                                        </div>
                                        <label>
                                            Audio
                                        </label>
                                    </div>
                                    <div class="insert-button item-video" data-mode="creator" data-type="video">
                                        <div class="icon">
                                        </div>
                                        <label>
                                            Video
                                        </label>
                                    </div>
                                    <div class="insert-button item-embed-link" data-mode="creator" data-type="embed">
                                        <div class="icon">
                                        </div>
                                        <label>
                                            Embed Link
                                        </label>
                                    </div>
                                    <span class="close">
                                    </span>
                                </div>
                            </div>
                            <div class="widget widget-header-text var-feel-modern-text-standard header-widget"
                            id="w-0089920183" style="display: block; -webkit-transform: none; -webkit-backface-visibility: hidden;">
                                <div class="top-line">
                                </div>
                                <div class="content colored-background" data-clicktarget="#">
                                    <h1 class="theme-title">
                                        <span class="autofit" style="word-wrap: inherit; font-size: 122.85714285714286%;"
                                        data-lines="1" data-priority="lines" data-max="+=20" data-target="title">
                                            Come to our shop!
                                        </span>
                                    </h1>
                                    <h3 class="theme-subtitle">
                                        <span class="autofit default-value" style="word-wrap: inherit; font-size: 100%;"
                                        data-target="subtitle">
                                            Add Subtitle
                                        </span>
                                    </h3>
                                </div>
                            </div>
                            <div class="widget widget-text-paragraph var-paragraph-standard sort-item empty-item has-task"
                            id="w-1137115458">
                                <div class="pagegrid">
                                    <div class="row">
                                        <div class="six columns alpha omega">
                                            <div class="content">
                                                <h2 class="theme-p-title theme-color3 default-value" data-target="title"
                                                data-clicktarget="#">
                                                    Our shop sells the best widgets in town!
                                                </h2>
                                                <div class="theme-p theme-color-4 default-value" data-target="content">
                                                    Write about what your business does. What's important to you? What makes
                                                    your business special? Is it your unique products? Is it your customer
                                                    service? Write about the one thing you'd want every visitor to know about
                                                    you.
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="clear">
                                    </div>
                                </div>
                                <div class="tools-container" style="">
                                    <div class="top-toolbar hover-tool" style="top: 2px; left: 458px;">
                                        <a class="top-tb top-tb-remove  input-ignore fn-segoe" style="display: block;">
                                            <span>
                                                Remove
                                            </span>
                                        </a>
                                        <a class="top-tb top-tb-edit  input-ignore fn-segoe">
                                            Edit
                                        </a>
                                        <div class="clear">
                                        </div>
                                    </div>
                                    <div class="insert-marker bottom-insert-marker input-ignore" style="bottom: -13.5px; left: 244px; display: block;">
                                    </div>
                                    <div class="insert-marker top-insert-marker input-ignore" style="display: block; top: -13.5px; left: 244px;">
                                    </div>
                                    <a class="nav-slider-left nav-slider input-ignore" style="top: 0px; left: -10px; height: 181px; background-position: 0px 54px;">
                                    </a>
                                    <a class="nav-slider-right nav-slider input-ignore" style="top: 0px; left: 638px; height: 181px; background-position: 0px 54px;">
                                    </a>
                                </div>
                            </div>
                            <div class="widget widget-text-small-title var-small-title-standard sort-item empty-item"
                            id="w-3672602378">
                                <div class="content align-center" data-clicktarget="#">
                                    <h2 class="theme-small-title theme-color1 webfont default-value" data-target="title"
                                    data-clicktarget="#">
                                        Our awesome products:
                                    </h2>
                                </div>
                            </div>
                            <div class="widget widget-gallery var-gallery-standard sort-item empty-item has-task"
                            id="w-2058550623">
                                <div class="content">
                                    <div class="gallery-items">
                                        <div class="gallery-item-container">
                                            <div class="framed-image-container" data-clicktarget="#">
                                                <div class="pic-wrapper empty-image-container">
                                                    <div data-field="url1" class="image-field  image-upload allow-crop empty-upload"
                                                    data-thumb="190x120" data-min-ratio="190:120" data-max-ratio="190:120"
                                                    data-mode="crop" data-allow-crop="true">
                                                        <label class="change fn-segoe">
                                                            Edit
                                                        </label>
                                                        <a class="clear input-ignore tipsy" title="Clear this picture">
                                                            &nbsp;
                                                        </a>
                                                        <form class="file-selector drop-target" style="display: block;">
                                                            <div class="file-wrapper">
                                                                <input type="file" class="file-input" name="file" title="Click to select an image"
                                                                accept="image/*">
                                                            </div>
                                                        </form>
                                                        <img class="framed-image lightboxed inactive">
                                                        <div class="pic-border">
                                                        </div>
                                                        <div class="progress-monitor fn-segoe">
                                                            <div class="progress-info">
                                                                <div class="progress-label">
                                                                </div>
                                                                <a class="abort input-ignore tipsy" title="abort the upload">
                                                                </a>
                                                                <div class="progress-bar">
                                                                    <span class="item" style="width: 0%;">
                                                                    </span>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <h2 class="theme-p-title theme-color3 default-value" data-target="title1"
                                            data-empty-if-target="url1" data-clicktarget="#">
                                                Red widget
                                            </h2>
                                            <div class="theme-p theme-color-4  gallery-description default-value"
                                            data-target="description1" data-empty-if-target="url1">
                                                <p>
                                                    For entry level jobs.
                                                </p>
                                            </div>
                                            <div class="clear">
                                            </div>
                                        </div>
                                        <div class="gallery-item-container">
                                            <div class="framed-image-container" data-clicktarget="#">
                                                <div class="pic-wrapper empty-image-container">
                                                    <div data-field="url2" class="image-field image-upload allow-crop empty-upload"
                                                    data-thumb="190x120" data-min-ratio="190:120" data-max-ratio="190:120"
                                                    data-mode="crop" data-allow-crop="true">
                                                        <label class="change fn-segoe">
                                                            Edit
                                                        </label>
                                                        <a class="clear input-ignore tipsy" title="Clear this picture">
                                                            &nbsp;
                                                        </a>
                                                        <form class="file-selector drop-target" style="display: block;">
                                                            <div class="file-wrapper">
                                                                <input type="file" class="file-input" name="file" title="Click to select an image"
                                                                accept="image/*">
                                                            </div>
                                                        </form>
                                                        <img class="framed-image lightboxed inactive">
                                                        <div class="pic-border">
                                                        </div>
                                                        <div class="progress-monitor fn-segoe">
                                                            <div class="progress-info">
                                                                <div class="progress-label">
                                                                </div>
                                                                <a class="abort input-ignore tipsy" title="abort the upload">
                                                                </a>
                                                                <div class="progress-bar">
                                                                    <span class="item" style="width: 0%;">
                                                                    </span>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <h2 class="theme-p-title theme-color3 default-value" data-target="title2"
                                            data-empty-if-target="url2" data-clicktarget="#">
                                                Yellow widget
                                            </h2>
                                            <div class="theme-p theme-color-4  gallery-description default-value"
                                            data-target="description2" data-empty-if-target="url2">
                                                <p>
                                                    For advanced widgeteers.
                                                </p>
                                            </div>
                                            <div class="clear">
                                            </div>
                                        </div>
                                        <div class="gallery-item-container last">
                                            <div class="framed-image-container" data-clicktarget="#">
                                                <div class="pic-wrapper empty-image-container">
                                                    <div data-field="url3" class="image-field image-upload allow-crop empty-upload"
                                                    data-thumb="190x120" data-min-ratio="190:120" data-max-ratio="190:120"
                                                    data-mode="crop" data-allow-crop="true">
                                                        <label class="change fn-segoe">
                                                            Edit
                                                        </label>
                                                        <a class="clear input-ignore tipsy" title="Clear this picture">
                                                            &nbsp;
                                                        </a>
                                                        <form class="file-selector drop-target" style="display: block;">
                                                            <div class="file-wrapper">
                                                                <input type="file" class="file-input" name="file" title="Click to select an image"
                                                                accept="image/*">
                                                            </div>
                                                        </form>
                                                        <img class="framed-image lightboxed inactive">
                                                        <div class="pic-border">
                                                        </div>
                                                        <div class="progress-monitor fn-segoe">
                                                            <div class="progress-info">
                                                                <div class="progress-label">
                                                                </div>
                                                                <a class="abort input-ignore tipsy" title="abort the upload">
                                                                </a>
                                                                <div class="progress-bar">
                                                                    <span class="item" style="width: 0%;">
                                                                    </span>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <h2 class="theme-p-title theme-color3 default-value" data-target="title3"
                                            data-empty-if-target="url3" data-clicktarget="#">
                                                Grey widget
                                            </h2>
                                            <div class="theme-p theme-color-4 gallery-description default-value" data-target="description3"
                                            data-empty-if-target="url3">
                                                <p>
                                                    For the man who has everything.
                                                </p>
                                            </div>
                                            <div class="clear">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="clear">
                                    </div>
                                </div>
                            </div>
                            <div class="widget widget-text-paragraph var-paragraph-image sort-item empty-item has-task"
                            id="w-8261539443">
                                <div class="content">
                                    <div class="side-img-container right side-img-floater no-mobile empty-image-container"
                                    data-clicktarget="#">
                                        <div data-field="picture" class="image-field image-upload empty-upload"
                                        data-thumb="172x120" data-min-ratio="172:80" data-max-ratio="172:250" data-mode="crop">
                                            <label class="change fn-segoe">
                                                Edit
                                            </label>
                                            <a class="clear input-ignore tipsy" title="Clear this picture">
                                                &nbsp;
                                            </a>
                                            <form class="file-selector drop-target" style="display: block;">
                                                <div class="file-wrapper">
                                                    <input type="file" class="file-input" name="file" title="Click to select an image"
                                                    accept="image/*">
                                                </div>
                                            </form>
                                            <img class="side-img inactive">
                                            <div class="pic-border">
                                            </div>
                                            <div class="progress-monitor fn-segoe">
                                                <div class="progress-info">
                                                    <div class="progress-label">
                                                    </div>
                                                    <a class="abort input-ignore tipsy" title="abort the upload">
                                                    </a>
                                                    <div class="progress-bar">
                                                        <span class="item" style="width: 0%;">
                                                        </span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <h2 class="theme-p-title theme-color3 default-value" data-target="title"
                                    data-clicktarget="#">
                                        Come to our shop!
                                    </h2>
                                    <div class="theme-p  theme-color-4 default-value" data-target="content">
                                        This is a good place to write about opening hours, your services or features
                                        you provide.
                                        <br>
                                        <br>
                                        <strong>
                                            Opening hours
                                        </strong>
                                        :
                                        <br>
                                        Monday - Friday: 9am-7pm
                                        <br>
                                        Saturday: 10am-5pm
                                        <br>
                                        Sunday: Closed
                                        <br>
                                    </div>
                                    <div class="clear">
                                    </div>
                                </div>
                            </div>
                            <div class="widget widget-text-bio var-bio-standard sort-item empty-item has-task"
                            id="w-3281804689">
                                <div class="pagegrid">
                                    <div class="row">
                                        <div class="two columns alpha no-mobile">
                                            <div class="content content-left">
                                                <div class="side-img-container empty-image-container" data-clicktarget="#">
                                                    <div data-field="picture" class="image-field image-upload empty-upload"
                                                    data-thumb="172x120" data-min-ratio="172:80" data-max-ratio="172:250" data-mode="crop">
                                                        <label class="change fn-segoe">
                                                            Edit
                                                        </label>
                                                        <a class="clear input-ignore tipsy" title="Clear this picture">
                                                            &nbsp;
                                                        </a>
                                                        <form class="file-selector drop-target" style="display: block;">
                                                            <div class="file-wrapper">
                                                                <input type="file" class="file-input" name="file" title="Click to select an image"
                                                                accept="image/*">
                                                            </div>
                                                        </form>
                                                        <img class="side-img inactive">
                                                        <div class="pic-border">
                                                        </div>
                                                        <div class="progress-monitor fn-segoe">
                                                            <div class="progress-info">
                                                                <div class="progress-label">
                                                                </div>
                                                                <a class="abort input-ignore tipsy" title="abort the upload">
                                                                </a>
                                                                <div class="progress-bar">
                                                                    <span class="item" style="width: 0%;">
                                                                    </span>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="four columns omega">
                                            <div class="content content-right">
                                                <h2 class="theme-p-title theme-color3 default-value" data-target="title"
                                                data-clicktarget="#">
                                                    We are WidgetLand!
                                                </h2>
                                                <div class="theme-p  theme-color-4" data-target="content">
                                                </div>
                                                <div class="info-box fn-segoe">
                                                    <a class="info-location" href="http://maps.google.com/maps?daddr=123%20Main%20st&amp;hl=en"
                                                    target="_blank" title="123 Main st">
                                                        123 Main st
                                                    </a>
                                                    <a class="info-email" href="mailto:contact@yourwebsite.com">
                                                        contact@yourwebsite.com
                                                    </a>
                                                    <a class="info-phone" href="tel:(206)-555-1234">
                                                        (206)-555-1234
                                                    </a>
                                                    <a class="info-website" href="http://yourwebsite.com" rel="me nofollow"
                                                    target="_blank" title="yourwebsite.com">
                                                        yourwebsite.com
                                                    </a>
                                                    <div class="clear">
                                                    </div>
                                                </div>
                                            </div>
                                            <!-- .content -->
                                            <div class="clear">
                                            </div>
                                        </div>
                                        <!-- columns -->
                                    </div>
                                    <!-- rows -->
                                    <div class="clear">
                                    </div>
                                </div>
                                <!-- page grid -->
                            </div>
                        </div>
                        <div class="bottom-insert-content" id="bottom-insert-bar">
                            <div class="bottom-insert-bar fn-segoe">
                                <div class="title">
                                    <h3>
                                        Add more stuff to your flyer
                                    </h3>
                                    <span class="description">
                                        Come on, you know you want to.
                                    </span>
                                </div>
                                <div class="insert-button item-text left" data-type="text.paragraph">
                                    <div class="icon">
                                    </div>
                                    <label>
                                        Text
                                    </label>
                                </div>
                                <div class="insert-button item-picture left" data-type="images.placeholder">
                                    <div class="icon">
                                    </div>
                                    <label>
                                        Picture
                                    </label>
                                </div>
                                <div class="insert-button item-event left" data-type="event">
                                    <div class="icon">
                                    </div>
                                    <label>
                                        Event
                                    </label>
                                </div>
                                <div class="insert-button item-audio left" data-mode="creator" data-type="audio">
                                    <div class="icon">
                                    </div>
                                    <label>
                                        Audio
                                    </label>
                                </div>
                                <div class="insert-button item-embed-link left" data-mode="creator" data-type="embed">
                                    <div class="icon">
                                    </div>
                                    <label>
                                        Embed Link
                                    </label>
                                </div>
                                <div class="insert-button item-form left" data-mode="creator" data-type="form">
                                    <div class="icon">
                                    </div>
                                    <label>
                                        Form
                                    </label>
                                </div>
                                <div class="insert-button item-title left" data-type="text.small_title">
                                    <div class="icon">
                                    </div>
                                    <label>
                                        Title
                                    </label>
                                </div>
                                <div class="insert-button item-gallery left" data-type="gallery">
                                    <div class="icon">
                                    </div>
                                    <label>
                                        Gallery
                                    </label>
                                </div>
                                <div class="insert-button item-bio left" data-type="text.bio">
                                    <div class="icon">
                                    </div>
                                    <label>
                                        Bio
                                    </label>
                                </div>
                                <div class="insert-button item-video left" data-mode="creator" data-type="video">
                                    <div class="icon">
                                    </div>
                                    <label>
                                        Video
                                    </label>
                                </div>
                                <div class="insert-button item-button left disabled has-tooltip" title="Coming soon!"
                                data-type="button">
                                    <div class="icon">
                                    </div>
                                    <label>
                                        Button
                                    </label>
                                </div>
                                <div class="insert-button item-payment left disabled has-tooltip" title="Coming soon!"
                                data-type="payment">
                                    <div class="icon">
                                    </div>
                                    <label>
                                        Payment
                                    </label>
                                </div>
                            </div>
                        </div>
                        <div class="clear">
                        </div>
                    </div>
                    <div class="page-bottom">
                    </div>
                </div>
            </div>
            <div class="clear">
            </div>
            <div id="creator-embed" style="display: none">
                <div class="embed-creator creator">
                    <div class="creator-container">
                        <div class="form form-content">
                            <div class="error-box" style="display: none;">
                            </div>
                            <label>
                                URL:
                            </label>
                            <input type="url" id="embed-url-input" autocomplete="off" spellcheck="false"
                            class="big-input url-input" placeholder="http://" tabindex="4001">
                            <label class="url-label">
                                Enter/Paste a URL to embed it in your page.
                                <br>
                                <small>
                                    Note: You can also enter YouTube, Vimeo and Shoplocket links.
                                </small>
                            </label>
                        </div>
                        <div class="loading" style="display: none">
                            <h3>
                                Loading...
                            </h3>
                        </div>
                    </div>
                    <div class="buttons-bar">
                        <a class="cancel">
                            Cancel
                        </a>
                        <button class="gray-button disabled embed-button" id="embed-button" tabindex="4002">
                            Embed
                        </button>
                    </div>
                </div>
            </div>
            <div id="creator-video" style="display: none">
                <div class="embed-creator creator">
                    <div class="creator-container">
                        <div class="form form-content">
                            <div class="error-box" style="display: none;">
                            </div>
                            <label>
                                Video URL:
                                <small>
                                    (example: http://vimeo.com/29872340)
                                </small>
                            </label>
                            <input type="url" autocomplete="off" spellcheck="false" class="big-input url-input"
                            placeholder="http://" tabindex="4003">
                            <label class="url-label">
                                Enter/Paste a video URL to embed it in your page.
                                <br>
                                <small>
                                    YouTube, Vimeo and Viddler are supported.
                                </small>
                            </label>
                        </div>
                        <div class="loading" style="display: none">
                            <h3>
                                Loading...
                            </h3>
                        </div>
                    </div>
                    <div class="buttons-bar">
                        <a class="cancel">
                            Cancel
                        </a>
                        <button class="gray-button disabled embed-button" tabindex="4004">
                            Embed
                        </button>
                    </div>
                </div>
            </div>
            <div id="creator-audio" style="display: none">
                <div class="embed-creator creator">
                    <div class="creator-container">
                        <div class="form form-content">
                            <div class="error-box" style="display: none;">
                            </div>
                            <label>
                                Audio URL:
                                <small>
                                    (example: http://soundcloud.com/thenextweb)
                                </small>
                            </label>
                            <input type="url" autocomplete="off" spellcheck="false" class="big-input url-input"
                            placeholder="http://" tabindex="4003">
                            <label class="url-label">
                                Enter/Paste an audio URL to embed it in your page.
                                <br>
                                <small>
                                    Only SoundCloud is supported for now. But it's awesome.
                                </small>
                            </label>
                        </div>
                        <div class="loading" style="display: none">
                            <h3>
                                Loading...
                            </h3>
                        </div>
                    </div>
                    <div class="buttons-bar">
                        <a class="cancel">
                            Cancel
                        </a>
                        <button class="gray-button disabled embed-button" tabindex="4004">
                            Embed
                        </button>
                    </div>
                </div>
            </div>
            <div id="creator-form" style="display: none">
                <div class="embed-creator creator">
                    <div class="creator-container">
                        <div class="form form-content">
                            <div class="error-box" style="display: none;">
                            </div>
                            <label>
                                Form URL:
                                <small>
                                    (example: https://examples.wufoo.com/forms/w7p6k5/)
                                </small>
                            </label>
                            <input type="url" autocomplete="off" spellcheck="false" class="big-input url-input"
                            placeholder="http://" tabindex="4003">
                            <label class="url-label">
                                Enter/Paste a Wufoo form URL to embed it in your page.
                                <br>
                                <small>
                                    Only Wufoo is supported for now. But it's awesome.
                                </small>
                            </label>
                        </div>
                        <div class="loading" style="display: none">
                            <h3>
                                Loading...
                            </h3>
                        </div>
                    </div>
                    <div class="buttons-bar">
                        <a class="cancel">
                            Cancel
                        </a>
                        <button class="gray-button disabled embed-button" tabindex="4004">
                            Embed
                        </button>
                    </div>
                </div>
            </div>
            <div id="browser-warning-modal" style="display: none">
                <div class="browser-warning">
                    <div class="content">
                        <h3>
                            Uh, hold on a minute partner...
                        </h3>
                        <p>
                            We're pretty sure that your
                            <strong>
                                browser isn't supported
                            </strong>
                            at the moment. You may be using an old browser or we may have made a mistake.
                        </p>
                        <p>
                            If you proceed, things may not work as they should.
                        </p>
                        <p>
                            We recommend you download the latest version of Google Chrome:
                        </p>
                        <p class="center">
                            <a class="gray-button google-chrome-button" href="https://www.google.com/chrome">
                                Download Google Chrome
                            </a>
                        </p>
                        <p class="center">
                            Alternatively, you can ignore this warning and go in at your own risk.
                        </p>
                        <p class="center small">
                            If you think this sucks, please give us a holler
                            <a href="mailto:hello@smore.com?subject=My browser is awesome!">
                                right now
                            </a>
                            .
                        </p>
                    </div>
                    <div class="buttons-bar">
                        <a class="left back">
                            « Back
                        </a>
                        <button class="gray-button medium-button right continue">
                            Continue anyway
                        </button>
                        <div class="clear">
                        </div>
                    </div>
                </div>
            </div>
            <div id="update-warning-modal" style="display: none">
                <div class="update-warning">
                    <div class="content">
                        <h3>
                            Smore has been updated!
                        </h3>
                        <p>
                            While you've been working, we've updated the app. We're just awesome that
                            way :)
                        </p>
                        <p>
                            Click below to continue working.
                        </p>
                    </div>
                    <div class="buttons-bar">
                        <button class="gray-button medium-button right reload">
                            Reload Smore
                        </button>
                        <div class="clear">
                        </div>
                    </div>
                </div>
            </div>
            <div id="welcome-tooltip" class="welcome-tooltip fn-segoe" style="top: -47px; left: -235px; margin-top: 0px; margin-left: 0px; margin-right: 0px; display: none;">
                <div class="right">
                    <button class="button gray-button skip-step">
                        Skip this step
                    </button>
                </div>
                <h2>
                    Start by picking a title
                </h2>
                <h4>
                    Titles are must for all flyers, but you can pick one later.
                </h4>
                <div class="tooltip-tip">
                </div>
            </div>
        </div>
        <!-- Bootstrap core JavaScript==================================================-
        ->
        <!-- Placed at the end of the document so the pages load faster -->
        <script src="https://code.jquery.com/jquery-1.10.2.min.js">
        </script>
        <script src="./js/bootstrap.min.js">
        </script>
        <script lang="javascript">
            $(document).ready(function() {
                $('[data-toggle=offcanvas]').click(function() {
                    $('.row-offcanvas').toggleClass('active');
                });

            });

            $('body').on('mouseover', '.widget',
            function(event) {
                var widget = $(event.currentTarget);
                widget.addClass('hover').find('.tools-container').addClass('active')
            }).on('mouseout', '.widget',
            function(event) {
                var widget = $(event.currentTarget);
                widget.removeClass('hover').find('.tools-container').removeClass('active')
            });
        </script>
    </body>

</html>